<div class="row">
    <div class="col s12">
        <nav>
            <div class="nav-wrapper">
                <!-- 品牌/店铺商品数据的tab -->
                <div class="col s12 center-align clearfix">
                    <a ng-click="vm.seen = true;" href="javascript:void(0)" class="breadcrumb left"><i class="angle left icon" ></i>返回</a>
                    <span class="sub title">{{'关键词-'+vm.word}}</span>
                </div>
            </div>
        </nav>
    </div>
</div>
<div class="row">
    <div class="col s12">
        <section class="box" style="overflow: hidden;margin-top: 50px">
            <header class="panel_header">
                <h2 class="title pull-left">{{vm.title}}</h2>
            </header>
            <div class="content-body">
                <div echarts-draw-canvas-line id="words_line" style="height: 400px;"></div>
            </div>
        </section>
    </div>
</div>
<div class="row">
    <div class="col s12" ng-hide="vm.tabSeen">
        <div class="col s12 m6" dw-loading="wordsTopProds">
            <section class="box" style="overflow: hidden;margin-top: 50px">
                <header class="panel_header">
                    <h2 class="title pull-left">{{'关键词-'+vm.word+'-商品排行榜'}}</h2>
                </header>
                <div class="content-body">
                    <table class="responsive-table centered highlight">
                        <thead>
                            <tr>
                                <th>宝贝</th>
                                <th>标题</th>
                                <th>销售额</th>
                                <th>销售量</th>
                                <th>售价</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr class="repeat-item" ng-repeat="prod in vm.topProds">
                                <td>
                                    <img ng-src="{{prod.picUrl}}" class="w65" alt="">
                                </td>
                                <td>
                                    <!-- class="truncate" style="max-width: 200px;overflow: hidden;" -->
                                    <a title="prod.title" href="https://item.taobao.com/item.htm?id={{prod.numberId}}" target="_blank" ng-bind-html="prod.title| highlight: vm.word">
                                    </a>
                                </td>
                                <td class="hisData cp" title="点击查看历史数据" jq-popup popup-config="prod" popup-dim="'sellMoney'" popup-type="'product'"
                                uib-popover-template="'myPopoverTemplate.html'" popover-class="popover_line" popover-trigger="'outsideClick'" popover-append-to-body="true">
                                    <span>{{prod.sellMoney | bigNum}}</span>
                                </td>
                                <td>{{prod.sellAmount | bigNum}}</td>
                                <td>{{prod.price}}</td>
                            </tr>
                            <tr ng-if="vm.topProds.length==0">
                                <td colspan="5">
                                    暂无数据
                                </td>
                            </tr>
                        </tbody>
                    </table>
                </div>
            </section>
        </div>
        <div class="col s12 m6" dw-loading="wordsTopShops">
            <section class="box" style="overflow: hidden;margin-top: 50px">
                <header class="panel_header">
                    <h2 class="title pull-left">{{'关键词-'+vm.word+'-店铺排行榜'}}</h2>
                </header>
                <div class="content-body">
                    <table class="responsive-table centered striped">
                        <thead>
                            <tr>
                                <th>排名</th>
                                <th>店铺名</th>
                                <th>近30天销售额</th>
                                <th>近30天'{{vm.word}}'商品的销售额</th>
                                <th style="width: 50px;">商品</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr class="repeat-item" ng-repeat="shop in vm.topShops">
                                <td>
                                    <a ng-class="{'ui circular label':true,'yellow':$index==0,'grey':$index==1,'orange':$index==2}">{{$index + 1}}</a>
                                </td>
                                <td>
                                    <a href="http://store.taobao.com/shop/view_shop.htm?user_number_id={{shop.userId}}" target="_blank">{{shop.shopName}}</a>
                                </td>
                                <td class="hisData cp" uid="{{shop.userId}}" dim="historySellMoney" jq-popup popup-config="shop" popup-type="'shop'" popup-dim="'historySellMoney'">{{shop.sellMoney | bigNum}}</td>
                                <td>
                                    {{shop.categoryValue | bigNum}}
                                </td>
                                <td>
                                    <a ng-click="vm.getShopDetail(shop.userId,shop.shopName)" class="cp" href="javascript:void(0)">商品</a>
                                </td>
                            </tr>
                            <tr ng-if="topShops.length==0">
                                <td colspan="5">
                                    暂无数据
                                </td>
                            </tr>
                        </tbody>
                    </table>
                </div>
            </section>
        </div>
    </div>
    <!-- 二级目录 商品详情 -->
    <table-list-component tab-seen="vm.tabSeen" ng-show="vm.tabSeen"></table-list-component>
</div>
